/**
 * Created by litch on 2017/7/11.
 */
import React from 'react'
import {Link, NavLink} from 'react-router-dom'
import {GET} from '../com/send'
import Table from '../com/Table'
class users extends React.Component {
    constructor(props) {
        super(props);
        this.state = {data: [],permission:[]};
    }

    componentDidMount() {
        this.setState({permission:sessionStorage.user.permission});
        GET('/api/user/list').then((resp) => {
            if (resp.code === 0) {
                this.setState({data: resp.data});
            }
        });
    }

    createTableItem(user,key) {
        return (
            <tr key={key}>
                <td>{user.name}</td>
                <td>{user.email}</td>
                <td>{user.create_date}</td>
                <td>
                    <Link className="btn btn-default" to="/users/edit">编辑</Link>
                </td>
            </tr>
        );
    }

    showTableItems(data) {
        return data.map((user,index) => this.createTableItem(user,index));
    }
    render() {

        return (
            <div>
                <div className="page-header">
                    <h1>用户管理</h1>
                    <div className="header-ops">
                        {() => {
                            if(this.state.permission.includes("user:add")){
                                return (
                                    <Link className="btn btn-success btn-sm toolsbtn" to="/users/add">添加用户</Link>
                                );
                            }
                        }}
                    </div>
                </div>
                <div className="panel panel-default">
                    {()=>{
                        if(true){
                            return (
                                <div className="panel-heading">
                                    <h3 className="panel-title">用户列表</h3>
                                </div>
                            );
                        }

                    }}

                    <div className="panel-body panel-body-table">
                        <div className="table-responsive">
                            <table className="table panel-table table-striped">
                                <thead>
                                <tr>
                                    <th>用户名</th>
                                    <th>绑定邮箱</th>
                                    <th>注册时间</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                {this.showTableItems(this.state.data)}
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        );
    }
}
export default users;